// pages/profile/friendInfo/index.ts
import tran from '../../../../utils/language'
import { commonTagList, commonRequestList } from '../../../../utils/api.js'
Component({
  pageLifetimes: {
    show() {
      this.getLangList()
      this.getProfession()
      this.getPlayList()
      this.getMbtil()
    }
  },
  /**
   * 组件的属性列表
   */
  properties: {
    defaultParams: {
      type: Object,
      value: {},
      observer(newVal) {
        if (newVal && Object.keys(newVal).length > 0) {
          this.handleData(newVal)
        }
      }
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    _t: tran._t('specialFilterPopup'),
    _tBase: tran._t('base'),
    type: 1,
    pickerParams: {
      show: false,
      pickerType: 'MBTI',
      defaultValue: ''
    },
    region: {},
    formData: {
      interestIds: '',
      professionId: '',
      personalities: '',
      professionName: '',
      languages: '',
      genderText: '',
      ageText: '',
      minAge: 0,
      maxAge: 0,
      online: 'all',
      currentProvinceCode: '',
      currentCityCode: '',
      currentDistrictCode: '',
      requestPlayText: '',
      requestPlayIds: '',
      friend: false,
      languageText: '',
      gender: ''
    },
    characterTypeList: ['ENTP', 'INTJ', 'ENTJ', 'ENFP', 'INFP'],
    multiIndex: [0, 0],
    commonPickerType: '',
    isEdit: getApp().globalData.profileFrom === 'edit',
    filterData: [{ text: '全部', key: '321231', selectFlag: true }, { text: '仅在线', key: '321431', selectFlag: false }],
    relationshipFilterData: [{ text: '全部', key: '1', selectFlag: true }, { text: '仅好友', key: '2', selectFlag: false }, { text: '新连接', key: '3', selectFlag: false }],
    additionalFlag: false,
    commonPickerGenderParams: {
      show: false,
      pickerType: 'gender',
      defaultValue: '',
      data: [] as commonPickerDataType[]
    },
    commonPickerAgeParams: {
      show: false,
      pickerType: 'age',
      defaultValue: '',
      data: [] as commonPickerDataType[]
    },
    pickerParams2: {
      show: false,
      pickerType: 'skill',
      defaultValue: '',
      title: '职业'
    },
    commonPickerParams: {
      show: false,
      pickerType: 'MBTI',
      defaultValue: '',
      data: [] as commonPickerDataType[]
    },
    playPickerParams: {
      show: false,
      pickerType: 'play',
      defaultValue: '',
      data: [] as commonPickerDataType[]
    },
    mbtiPickerParams: {
      show: false,
      pickerType: 'mbti',
      defaultValue: '',
      data: [] as commonPickerDataType[]
    },
    commonPickerData: [] as commonPickerDataType[],
    commonPickerGenderData: [] as commonPickerDataType[],
    langList: [],
    ageList: [
      {
        selectFlag: false,
        text: '18及以下',
        value: '0-18'
      },
      {
        selectFlag: false,
        text: '18-25',
        value: '18-25'
      },
      {
        selectFlag: false,
        text: '26-32',
        value: '26-32'
      },
      {
        selectFlag: false,
        text: '33-41',
        value: '33-41'
      },
      {
        selectFlag: false,
        text: '42-55',
        value: '42-55'
      },
      {
        selectFlag: false,
        text: '55及以上',
        value: '55-200'
      }
    ],
    playList: [],
    mbtiList: [],
    regionTextList: [],
    pickerHomeAreaParams: {
      show: false,
      pickerType: 'areaHomeRegion',
      defaultValue: [''],
      data: [] as commonPickerDataType[]
    },
    homeRegion: [''],
  },

  /**
   * 组件的方法列表
   */
  methods: {
    pickerHomeRegionCancle() {
      const { pickerHomeAreaParams } = this.data
      pickerHomeAreaParams.show = false
      this.setData({
        pickerHomeAreaParams
      })
    },
    /**
     * 区域选择器确认按钮
     * @param e 
     */
    commonHomeAreaPickerConfirm(e: any) {
      const obj = e.detail.value
      if (obj && Object.keys(obj).length > 0) {
        const { formData } = this.data
        const regionCodeList: any = [obj.provincesValue, obj.cityValue, obj.regionValue]
        const regionTextList: any = [obj.provincesLabel, obj.cityLabel, obj.regionLabel]
        if (regionCodeList.length > 0) {
          formData.currentProvinceCode = obj.provincesValue
          formData.currentCityCode = obj.cityValue
          formData.currentDistrictCode = obj.regionValue
        }
        this.pickerHomeRegionCancle()
        this.setData({
          regionTextList,
          regionCodeList,
          formData,
        })
      }
    },
    handleCommonHomeAreaPicker(e: baseEvent) {
      const { pickerHomeAreaParams, formData, homeRegion } = this.data
      const type = e.currentTarget.dataset.type;
      pickerHomeAreaParams.pickerType = type
      pickerHomeAreaParams.show = true
      // pickerHomeAreaParams.defaultValue = homeRegion
      this.setData({ pickerHomeAreaParams, commonPickerType: type })
    },
    /**
     * 获取一起玩列表
     */
    getPlayList() {
      const params = {
        requestType: 'PLAY'
      }
      commonRequestList(params).then(res => {
        res.length > 0 && res.map((item: any) => {
          item.text = item.reqName
          item.value = item.reqTypeId
        })
        this.setData({
          playList: res
        })
      })
    },
    /**
     * 处理父组件带过来的参数，给表单回显
     */
    handleData(obj: any) {
      let { commonPickerParams, regionTextList, commonPickerGenderParams, commonPickerAgeParams, formData, pickerParams2, filterData, pickerParams, playPickerParams, pickerHomeAreaParams } = this.data
      commonPickerParams.defaultValue = obj.languages || ''
      formData.languageText = obj.languageText || ''
      regionTextList = obj.regionTextList || []
      commonPickerGenderParams.defaultValue = obj.gender || ''
      commonPickerAgeParams.defaultValue = obj.ageText || ''
      pickerParams2.defaultValue = obj.professionId || ''
      formData.professionName = obj.professionName || ''
      formData.personalities = obj.personalities || ''
      formData.genderText = obj.genderText || ''
      formData.requestPlayIds = obj.requestPlayIds || ''
      formData.requestPlayText = obj.requestPlayText || ''
      playPickerParams.defaultValue = obj.requestPlayIds || ''
      formData.ageText = obj.ageText || ''
      pickerParams.defaultValue = obj.personalities || ''
      pickerHomeAreaParams.defaultValue = obj.regionTextList || []
      if (obj.online) {
        filterData.map(item => {
          if (item.key == obj.online) {
            item.selectFlag = true
          } else {
            item.selectFlag = false
          }
        })
      }
      this.setData({
        commonPickerParams,
        regionTextList,
        commonPickerGenderParams,
        commonPickerAgeParams,
        formData,
        pickerParams,
        pickerHomeAreaParams
      })
    },
    resetTap() {
      let formData = {
        interestIds: '',
        characterType: '',
        professionId: '',
        personalities: '',
        professionName: '',
        interestName: '',
        languageText: '',
        languages: '',
        genderText: '',
        gender: '',
        ageText: '',
        minAge: 0,
        maxAge: 0,
        online: 'all',
        currentProvinceCode: '',
        currentCityCode: '',
        currentDistrictCode: ''
      }
      this.setData({
        formData
      })
    },
    confirmPopup() {
      this.triggerEvent('confirmPopup', this.data.formData)
    },
    onClose() {
      this.triggerEvent('onClose')
    },

    additionalTap() {
      this.setData({
        additionalFlag: !this.data.additionalFlag
      })
    },
    toFriendSelectPage(e: any) {
      const currentIndex = e.currentTarget.dataset.index
      const { relationshipFilterData, formData } = this.data
      const flag = false;
      relationshipFilterData.length > 0 && relationshipFilterData.map((item, index) => {
        if (index === currentIndex) {
          item.selectFlag = true
          if (currentIndex == 1) {
            formData.friend = true
          } else if (currentIndex == 2) {
            formData.friend = false
          } else {
            formData.friend = null
          }
        } else {
          item.selectFlag = false
        }

      })
      this.setData({
        relationshipFilterData,
        formData
      })
    },
    // pickerCancel(e: { detail: any }) {
    //   if (e.detail) {
    //     // 有值表示是确认
    //     this.setData({ formData: { ...this.data.formData, ...e.detail } })
    //   }
    //   this.setData({ pickerParams: { show: false, pickerType: '', defaultValue: '' } })
    // },
    bindMultiPickerColumnChange(e: any,) {
      let columnIndex = e.detail.column
      let valueIndex = e.detail.value
      let { multiIndex } = this.data
      if (columnIndex == 0) {
        multiIndex[0] = valueIndex
      } else {
        multiIndex[1] = valueIndex
      }
      this.setData({
        multiIndex
      })
    },
    // handleCommonPicker(e: baseEvent) {
    //   const { commonPickerParams, langList } = this.data
    //   const type = e.currentTarget.dataset.type;
    //   commonPickerParams.pickerType = type
    //   commonPickerParams.show = true
    //   this.setData({ commonPickerParams, commonPickerData: langList, commonPickerType: type })
    // },
    handlePlayPicker(e: baseEvent) {
      const { playPickerParams, playList } = this.data
      const type = e.currentTarget.dataset.type;
      playPickerParams.pickerType = type
      playPickerParams.show = true
      this.setData({ playPickerParams, commonPickerData: playList, commonPickerType: type })
    },
    handleMbtiPicker(e: baseEvent) {
      const { mbtiPickerParams, mbtiList } = this.data
      const type = e.currentTarget.dataset.type;
      mbtiPickerParams.pickerType = type
      mbtiPickerParams.show = true
      this.setData({ mbtiPickerParams, commonPickerData: mbtiList, commonPickerType: type })
    },
    /**
      * 获取职业技能列表
      */
    getProfession() {
      const listAll = wx.getStorageSync('professionList')
      let list = [{
        text: '全部',
        value: null,
        selectFlag: false,
        tagTypeId: ''
      }]
      listAll.length > 0 && listAll.map((item: any) => {
        item.text = item.tagName
        item.selectFlag = false
        item.value = item.tagTypeId
        list.push(item)
      })
      this.setData({
        selectList: list,
        professionList: list
      })
    },
    characterTypeChange(e: any) {
      const { formData, characterTypeList } = this.data
      const index = e.detail.value
      formData.characterType = characterTypeList[index]
      this.setData({
        formData
      })
    },
    bindRegionChange(e: any) {
      const { formData } = this.data
      const regionCodeList = e.detail.code
      const regionTextList = e.detail.value
      const regionPostcode = e.detail.opstcode
      if (regionCodeList.length > 0) {
        formData.currentProvinceCode = regionCodeList[0]
        formData.currentCityCode = regionCodeList[1]
        formData.currentDistrictCode = regionCodeList[2]
      }
      this.setData({
        regionTextList,
        regionCodeList,
        regionPostcode
      })
    },
    /**
     * 普通的选择器确认按钮
     * @param e 
     */
    commonPickerConfirm(e: any) {
      const { commonPickerType, commonPickerParams, commonPickerGenderParams, commonPickerAgeParams } = this.data
      const obj = e.detail.value
      console.log(obj);
      commonPickerParams.show = false
      commonPickerGenderParams.show = false
      commonPickerAgeParams.show = false
      const { formData } = this.data
      if (commonPickerType == 'language') { // 语言
        formData.languageText = obj.text
        formData.languages = obj.value
      } else if (commonPickerType == 'gender') { // 性别
        formData.genderText = obj.text || '全部'
        formData.gender = obj.value || '3'
      } else if (commonPickerType == 'age') { // 年龄范围
        formData.ageText = obj.text
        const list = obj.value.split('-')
        formData.minAge = list[0]
        formData.maxAge = list[1]
      } else if (commonPickerType == 'skill') { // 技能
        formData.professionName = obj.text
        formData.professionId = obj.value
      } else if (commonPickerType == 'play') { // 要找什么搭子
        formData.requestPlayText = obj.text
        formData.requestPlayIds = obj.value
      } else if (commonPickerType == 'mbti') { // 性格类型
        formData.personalities = obj.text
      }
      console.log(formData);
      this.setData({
        formData,
        commonPickerParams,
        commonPickerGenderParams,
        commonPickerAgeParams,
      })
      this.pickerCommonCancel()
    },
    /**
     * 从app.ts里面获取全局的语言列表
     */
    getLangList() {
      let list = getApp().globalData.langList
      let langList: any = [
        {
          selectFlag: false,
          text: '全部',
          value: 'all'
        }
      ]
      list.length > 0 && list.map((item: any) => {
        const obj = {
          selectFlag: false,
          ...item
        }
        langList.push(obj)
      })
      this.setData({
        langList
      })
    },
    getMbtil() {
      let list = getApp().globalData.mbtiList
      let mbtiList: any = [
        // {
        //   selectFlag: false,
        //   text: '全部'
        // }
      ]
      list.length > 0 && list.map((item: any) => {
        const obj = {
          selectFlag: false,
          text: item
        }
        mbtiList.push(obj)
      })
      const { pickerParams } = this.data
      pickerParams.data = mbtiList
      this.setData({
        selectList: mbtiList,
        mbtiList
      }, () => {
      })
    },
    /**
     * 清空选项列表
     */
    clearSelectList() {
      this.setData({
        selectList: []
      })
    },
    /**
     * 获取兴趣列表
     */
    getInterest() {
      let params = {
        tagType: 'INTEREST'
      }
      commonTagList(params).then(res => {
        res.length > 0 && res.map((item: any) => {
          item.text = item.tagName
          item.selectFlag = false
        })
        this.setData({
          selectList: res,
          interestList: res
        })
      })
    },

    /**
     * 打开选项的面板
     * @param e 
     */
    // handleMbtiPicker(e: any) {
    //   const type = e.currentTarget.dataset.type;
    //   const { selectList, pickerParams, pickerParams1, pickerParams2, mbtiList } = this.data
    //   let list = []
    //   if (type == 'interest') { // 兴趣
    //     pickerParams1.show = true
    //     pickerParams1.pickerType = type
    //     list = this.data.interestList
    //     this.setData({
    //       pickerParams1: pickerParams1
    //     })
    //   } else if (type == 'skill') { // 职业技能
    //     // this.getProfession()
    //     pickerParams2.show = true
    //     pickerParams2.pickerType = type
    //     list = this.data.professionList
    //     this.setData({
    //       pickerParams2: pickerParams2
    //     })
    //   } else { // 性格mbti
    //     // this.getMbtil()
    //     pickerParams.show = true
    //     pickerParams.pickerType = type
    //     // pickerParams.data = mbtiList
    //     console.log(mbtiList);

    //     list = selectList
    //     this.setData({
    //       pickerParams: pickerParams
    //     })
    //   }
    //   this.setData({
    //     selectListArr: list
    //   })
    //   this.setData({
    //     characterSelectFlag: true,
    //     selectType: type || 'mbti',
    //   })
    // },
    handleCommonSkillPicker(e: baseEvent) {
      const { pickerParams2 } = this.data
      const type = e.currentTarget.dataset.type;
      pickerParams2.pickerType = type
      pickerParams2.show = true
      this.setData({ pickerParams2, commonPickerType: type })
    },
    handleCommonPicker(e: baseEvent) {
      const { commonPickerParams, langList } = this.data
      const type = e.currentTarget.dataset.type;
      commonPickerParams.pickerType = type
      commonPickerParams.show = true
      this.setData({ commonPickerParams, commonPickerData: langList, commonPickerType: type })
    },
    handleCommonAgePicker(e: baseEvent) {
      const { commonPickerAgeParams } = this.data
      // 打开picker 设置对应的picker弹出类型
      const type = e.currentTarget.dataset.type;
      commonPickerAgeParams.pickerType = type
      commonPickerAgeParams.show = true
      this.setData({ commonPickerAgeParams, commonPickerType: type })
    },
    handleCommonGenderPicker(e: baseEvent) {
      const { commonPickerGenderParams } = this.data
      let list = [
        {
          text: '全部',
          value: '',
          selectFlag: false
        },
        {
          text: '女性',
          value: '2',
          selectFlag: false
        },
        {
          text: '男性',
          value: '1',
          selectFlag: false
        },
        {
          text: '其他',
          value: '0',
          selectFlag: false
        }
      ]
      // 打开picker 设置对应的picker弹出类型
      const type = e.currentTarget.dataset.type;
      commonPickerGenderParams.pickerType = type
      commonPickerGenderParams.show = true
      // commonPickerParams.data = langList
      this.setData({ commonPickerGenderParams, commonPickerGenderData: list, commonPickerType: type })
    },

    handleInterestPicker(e: any) {
      const type = e.currentTarget.dataset.type;
      this.setData({
        characterSelectFlag: true,
        selectType: type || 'interest',
        pickerParams: { show: true, pickerType: type, defaultValue: '', title: '性格类型' }
      })

    },
    handleButtonTap(event: any) {
      // console.log(22, event);
      //阻止默认滑动事件
      // event.preventDefault();
      // event.stopPropagation()
    },
    handlePicker(e: baseEvent) {
      // 打开picker 设置对应的picker弹出类型
      const type = e.currentTarget.dataset.type;
      const { formData } = this.data
      let defaultValue = ''
      if (type == 'interest') { // 兴趣
        defaultValue = formData.interestIds
      } else if (type == 'professionId') { // 职业技能
        defaultValue = formData.professionId
      }
      this.setData({ pickerParams: { show: true, pickerType: type, defaultValue: defaultValue, title: '性格类型' } })
    },
    pickerCommonCancel() {
      const { playPickerParams, commonPickerGenderParams, commonPickerParams, commonPickerAgeParams } = this.data
      playPickerParams.show = false
      commonPickerGenderParams.show = false
      commonPickerParams.show = false
      commonPickerAgeParams.show = false
      this.setData({
        playPickerParams,
        commonPickerGenderParams,
        commonPickerParams,
        commonPickerAgeParams,
      })
    },
    pickerCancel(e: { detail: any }) {
      if (e.detail) {
        // 有值表示是确认
        // this.setData({ formData: { ...this.data.formData, ...e.detail } })
      }
      this.setData({
        pickerParams: { show: false, pickerType: '', defaultValue: '', title: '性格类型' },
        pickerParams1: { show: false, pickerType: '', defaultValue: '', title: '兴趣' },
        pickerParams2: { show: false, pickerType: '', defaultValue: '', title: '职业' }
      })
    },
    tapMbti(e: any) {
      const { info } = e.currentTarget.dataset
      const { selectList } = this.data
      // 判断用户点击的是哪一个按钮，从而将那一个按钮状态反选
      selectList.map(item => {
        if (item.text === info.text) {
          item.selectFlag = !item.selectFlag
        }
      })
      this.setData({
        selectList: selectList
      })
    },
    // 性格选择器面板确认按钮
    confirmPicker(e: any) {
      // this.handlePickerData(value)
      this.setData({
        selectMbtiList: e.detail
      }, () => {
        this.handlePickerData()
      })
    },
    // 处理选择器的数据
    handlePickerData() {
      const { selectMbtiList, formData, selectType, pickerParams, pickerParams2 } = this.data
      pickerParams.show = false
      pickerParams2.show = false
      // 过滤出选中的几项
      let ids: any = []
      let nameList: any = []
      selectMbtiList.length > 0 && selectMbtiList.map(item => {
        ids.push(item.tagTypeId)
        nameList.push(item.text)
      })
      if (selectType == 'interest') { // 兴趣
        formData.interestIds = ids.length > 0 ? ids.join(',') : ''
        formData.interestName = nameList.length > 0 ? nameList.join(',') : ''
      } else if (selectType == 'skill') { // 职业技能
        formData.professionId = ids.length > 0 ? ids.join(',') : ''
        formData.professionName = nameList.length > 0 ? nameList.join(',') : ''
      } else { // mbti
        let textList: any = []
        selectMbtiList.length > 0 && selectMbtiList.map(item => {
          textList.push(item.text)
        })
        formData.personalities = textList.length > 0 ? textList.join(',') : ''
        this.setData({
          formData
        })
      }
      this.setData({
        characterSelectFlag: false,
        formData,
        pickerParams,
        pickerParams2
      })

    },
    characterConfirm() {
      const { selectList, formData, selectType } = this.data
      // 过滤出选中的几项
      const selectMbtiList = selectList.filter(item => item.selectFlag)
      let ids: any = []
      let nameList: any = []
      selectMbtiList.length > 0 && selectMbtiList.map(item => {
        ids.push(item.tagTypeId)
        nameList.push(item.text)
      })
      if (selectType == 'interest') { // 兴趣
        formData.interestIds = ids.length > 0 ? ids.join(',') : ''
        formData.interestName = nameList.length > 0 ? nameList.join(',') : ''
      } else if (selectType == 'skill') { // 职业技能
        formData.professionId = ids.length > 0 ? ids.join(',') : ''
        formData.professionName = nameList.length > 0 ? nameList.join(',') : ''
      } else { // mbti
        let textList: any = []
        selectMbtiList.length > 0 && selectMbtiList.map(item => {
          textList.push(item.text)
        })
        formData.personalities = textList.length > 0 ? textList.join(',') : ''
      }
      this.setData({
        characterSelectFlag: false,
        currentMbtiList: selectMbtiList,
        formData
      })
    },
    onSwitchChange() {
      this.setData({
        switchChecked: !this.data.switchChecked
      })
    },
    toSelectPage(e: any) {
      const currentIndex = e.currentTarget.dataset.index
      const { filterData } = this.data
      filterData.length > 0 && filterData.map((item, index) => {
        if (index === currentIndex) {
          item.selectFlag = true
        } else {
          item.selectFlag = false
        }
      })
      this.setData({
        filterData
      })
    },
    closePopup() {
      this.setData({ popupParams: { showPopup: false, showType: 1 } })
    },
    onClosePopup() {
      const customPopup = this.selectComponent('#custom-popup');
      customPopup && customPopup.hidePopup()
    },
    swiperChange(e: any) {
      const currentIndex = e.detail.current
      const { imgList } = this.data
      imgList.length > 0 && imgList.map((item, index) => {
        if (index === currentIndex) {
          item.selectFlag = true
        } else {
          item.selectFlag = false
        }
      })
      this.setData({
        imgList
      })

    },
    sendChange(e: any) {
      this.setData({
        sendFlag: e.detail,
      })
    },
    changeSkillSelect(e: any) {
      const { info } = e.currentTarget.dataset
      const { skillList } = this.data
      // 判断用户点击的是哪一个按钮，从而将那一个按钮状态反选
      skillList.map(item => {
        if (item.text === info.text) {
          item.selectFlag = !item.selectFlag
        }
      })
      this.setData({
        skillList: skillList
      })
    },
    changeSelect(e: any) {
      const { info } = e.currentTarget.dataset
      const { selectList } = this.data
      // 判断用户点击的是哪一个按钮，从而将那一个按钮状态反选
      selectList.map(item => {
        if (item.text === info.text) {
          item.selectFlag = !item.selectFlag
        }
      })
      this.setData({
        selectList: selectList
      })
    },
    changeIndicatorDots() {
      this.setData({
        indicatorDots: !this.data.indicatorDots
      })
    },

    changeAutoplay() {
      this.setData({
        autoplay: !this.data.autoplay
      })
    },

    intervalChange(e: any) {
      this.setData({
        interval: e.detail.value
      })
    },

    durationChange(e: any) {
      this.setData({
        duration: e.detail.value
      })
    },

  }
})